import React, { Component } from 'react'
import axios from 'axios'
import '../../mock/index'
// import homeStyle from './style.module.scss'
export default class Home extends Component {
  constructor(props) {
    super(props)
    this.state = {
      count: 0,
      timer: null,
    }
    console.log('constructor')
  }
  // componentWillMount() {
  //   console.log('componentWillMount')
  // }
  render() {
    console.log('纯函数 render')
    return <div>Home,page</div>
  }

  componentDidMount() {
    // axios.get('/api/users').then((res) => {
    //   console.log('res:', res)
    // })
    axios.post('/api/login', { username: '123' }).then((res) => {
      console.log('res:', res)
    })

    // this.timer = setInterval(() => {
    //   this.setState({
    //     count: this.state.count + 1,
    //   })
    // }, 1000)
    // EventLoop
    console.log('componentDidMount 处理副作用 1. ajax 2. dom操作 3. 订阅事件 ')
    // fetch('https://api.github.com/users/wyp0712')
    //   .then((res) => res.json())
    //   .then((res) => {
    //     console.log('res:', res)
    //   })
  }

  componentDidUpdate() {
    // console.log('update:', this.state.count)
    // console.log('更新：componentDidUpdate')
    // fetch(`https://api.github.com/users/${this.state.count}`)
    //   .then((res) => res.json())
    //   .then((res) => {
    //     console.log('res:', res)
    //   })
  }

  componentWillUnmount() {
    // 取消订阅 取消定时器
    // clearInterval(this.timer)
    console.log('卸载home componentWillUnmount')
  }
}
